<template>
  <div id="app">
      <ul class="pagination">
        <li v-for="n in pageCount">
          <button v-on:click="btnActivecliecl(n,$event)">1122222</button>
          <a href="javascript:void(0);" v-on:click="btnActivecliecl(n,$event)" v-bind:class="activeNumber === n ? 'active' : ''">{{ n }}</a>
        </li>
      </ul>
    </div>
</template>

<script>
  export default {
    props: {
        pageCount:{
          type:Number,
          default: 1
        }
    },
    data:function(){
      return {
        activeNumber:1
      }
    },
    methods:{
          btnActivecliecl:function (n,event) {
            console.log(n);
            console.log(event);
            this.activeNumber = n;
            this.$emit('btnActivecliecl');
          }
        }
  }
</script>
<style scoped>
  @import './css/qui-page-import.css';
</style>